<template>
<a-modal :maskClosable="false" v-model="modalVisible" :title="modalTitle" width="1200px" :modal-closable="false" :footer="null">
  <a-tabs v-model="tabActiveKey">
    <a-tab-pane key="baseInfo" tab="基础信息" :disabled="tabActiveKey !== 'baseInfo'">
      <base-info-form @submit="baseInfoSubmit" ref="baseInfoForm"></base-info-form>
    </a-tab-pane>
    <a-tab-pane key="signInfo" tab="签约信息" :disabled="tabActiveKey !== 'signInfo'">
      <sign-info-form @submit="signInfoSubmit" ref="signInfoForm"></sign-info-form>
    </a-tab-pane>
    <a-tab-pane key="imageInfo" tab="影像信息" :disabled="tabActiveKey !== 'imageInfo'">
      <image-info-form @submit="imageInfoSubmit" ref="imageInfoForm"></image-info-form>
    </a-tab-pane>
    <a-tab-pane key="settleInfo" tab="结算信息" :disabled="tabActiveKey !== 'settleInfo'" v-if="this.flag !== 'N'">
      <settle-info-form @submit="settleInfoSubmit" ref="settleInfoForm"></settle-info-form>
    </a-tab-pane>
    <a-tab-pane key="productionInfo" tab="业务产品信息" :disabled="tabActiveKey !== 'productionInfo'" v-if="this.flag !== 'N'">
      <production-info @submit="productionInfoSubmit" ref="productionInfoForm"></production-info>
    </a-tab-pane>
  </a-tabs>
</a-modal>
</template>

<script>
import BaseInfoForm from './BaseInfoForm'
import SignInfoForm from './SignInfoForm'
import ImageInfoForm from './ImageInfoForm'
import SettleInfoForm from './SettleInfoForm'
import ProductionInfo from './ProductionInfo'
export default {
  name: 'MerchantBaseInfoOperation',
  components: {BaseInfoForm, SignInfoForm, ImageInfoForm, SettleInfoForm, ProductionInfo},
  provide: function () {
    return {
      operationContext: this
    }
  },
  inject: ['merchantBaseInfoContext'],
  data: function () {
    return {
      modalVisible: false,
      modalTitle: '',
      beanInfo: {},
      tabActiveKey: "",
      instId: "",
      beanInfo: "",
      operatorType: "",
      flag: "",
    }
  },
  methods: {
    openModal (type = 'view', beanInfo) {
      const modalName = '商户信息'
      this.modalTitle = {add: `新增${modalName}`, edit: `编辑${modalName}`, view: `${modalName}详情`, use: `启用${modalName}`, stop: `停用${modalName}`, cancel: `注销${modalName}`,chk: `审核${modalName}`}[type]
      this.modalVisible = true
      this.tabActiveKey = 'baseInfo'
      this.beanInfo = beanInfo;
      this.operatorType = type

    },
    baseInfoSubmit() {
      this.tabActiveKey = 'signInfo'
      if(typeof this.$refs.signInfoForm !== "undefined"){
        this.$refs.signInfoForm.getPageInfo()
      }
    },
    signInfoSubmit() {
      this.tabActiveKey = 'imageInfo'
      if(typeof this.$refs.imageInfoForm !== "undefined"){
        this.$refs.imageInfoForm.getPageInfo()
      }
    },
    imageInfoSubmit() {
      if(this.flag === 'N'){
        this.modalVisible = false
        this.merchantBaseInfoContext.search()
        return
      }
      this.tabActiveKey = 'settleInfo'
      if(typeof this.$refs.settleInfoForm !== "undefined"){
        this.$refs.settleInfoForm.getPageInfo()
      }
    },
    settleInfoSubmit() {
      this.tabActiveKey = 'productionInfo'
      if(typeof this.$refs.productionInfoForm !== "undefined"){
        this.$refs.productionInfoForm.getPageInfo()
      }
    },
    productionInfoSubmit() {
      this.modalVisible = false
      this.merchantBaseInfoContext.search()
    },
  }
}
</script>

<style lang="less" scoped>
  @import "../../../../../static/less/Common";

</style>
